<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>运动数据</title>
</head>

<body>
    <!-- 上边主体 -->
    <main>
        <!-- 返回图标 -->
        <p class="iconfont icon-anniu_jiantouxiangzuo_o"></p>

        <!-- 我的运动数据 -->
        <div class="my-sports">
            <strong>我的运动数据</strong>
            <img src="../../assets/images/dog.jpg" alt="">
        </div>

        <!-- 总运动 -->
        <div class="total-sports">
            <!-- 总运动 -->
            <div>
                <p>总运动</p>
                <p><span class="duration">9999</span>分钟</p>
            </div>
            <!-- 本周消耗 -->
            <div>
                <p>本周消耗</p>
                <p><span class="calorie">9999</span>千卡</p>
            </div>
        </div>

        <!-- 消耗 -->
        <div class="consume">
            <div>
                里程（米）
                <span class="meter">9999</span>
            </div>
            <div>
                累计（天）
                <span class="total">9999</span>
            </div>
            <div>
                连续（天）
                <span class="continuous">9999</span>
            </div>
        </div>
    </main>

    <!-- 下边图表数据 -->
    <div class="charts">
        <div class="chart chart1"></div>
        <div class="chart chart2"></div>
        <div class="chart chart3"></div>
        <div class="chart chart4"></div>
    </div>
</body>

</html>